@layout("/common/_container.html"){
<style>
    .selectStyles{
        width: 60%;height: 30px;border: 1px solid #DDDDDD;border-radius: 2px;padding-left: 10px;
    }
</style>
<div class="ibox float-e-margins">
    <div style="display: none">
        <input type="hidden" id="sortMap" value="">
        <input type="hidden" id="reservationsId" value="${reservationsId}">
        <input type="hidden" id="customerId" value="${customerId}">
        <input type="hidden" id="operationTime" value="${operationTime}">
        <input type="hidden" id="id2" value="${rechargeInfo.id}">
        <input type="hidden" id="getTime" value="${getTime}">
        <input type="hidden" id="payorrefund" value="${payorrefund}">
        <input type="hidden" id="startTime" value="">
        <input type="hidden" id="endTime" value="">

        <input type="hidden" id="totleFoldingPay" value="${totleFoldingPay}"/>
        <input type="hidden" id="totleServiceActualPay" value="${totleServiceActualPay}"/>
        <input type="hidden" id="serviceActualPay" value="${serviceActualPay}"/>
    </div>
    <div class="ibox-content">
        <div class="form-horizontal" id="addForm">

            <div class="row">
                <div class="col-sm-12 proSort">
                    <div class="panel-body" style="text-align: center">
                        <span id="moneyShou" style="font-size: 25px;font-weight: bold;"></span>
                    </div>
                    <div style="height:400px;overflow:auto;padding-top: 20px;position: relative;border: 1px solid #d6d6d6;" class="panel panel-success sortRight">
                        <div style="position: relative">
                            <div style="margin-top: 15px;" class="way clearfix">
                                <div class="col-sm-4">
                                    <span>方式 :</span>
                                    <select class="selectBox checkoutMethodName selectStyles" name="checkoutMethodName" >
                                        @for(item in checkoutMethodInfo){
                                        <option value="${item.checkoutMethod}">${item.checkoutMethod}</option>
                                        @}
                                    </select>
                                </div>
                                <div class="col-sm-4">
                                    <span>金额 :</span>
                                    <input class="amountOfBalance2 selectStyles" name="amountOfBalance2" />
                                </div>
                                <div class="col-sm-4">
                                    <span>备注 :</span>
                                    <input class="remarks selectStyles" name="remarks" />
                                </div>
                            </div>
                            <div style="position: absolute;bottom: -7px;right: 12px;">
                                <p class="clearfix"><a href="javascript:;" style="color: #30add1" class="addway">添加</a></p>
                            </div>
                        </div>
                        <div style="text-align: center;position: absolute;bottom: 20px;width: 100%;">
                            <div class="btnBox">
                                <button type="button" class="btn" onclick="Recharge.addBalance()">提交</button>
                                <button type="button" style="background: #999999" class="btn" id="cancel" onclick="parent.layer.close(parent.layer.getFrameIndex(window.name))">取消</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<style>
    .btnBox button {
        background: #30add1;
        color: white;
        width: 96px;
    }
    #ar{
        display: inline-block;
        position: absolute;
        right: 10px;
    }
    .arTwo_bt{
        outline: none;
        border: none;
        padding: 0 ;
        display: inline-block;
        width: 60px;
        height: 25px;
        line-height: 25px;
        border-radius: 20px;
        background: url("${ctxPath}/static/img/y102.png");
        background-size: cover;
        text-align: center;
        color: white;
    }
    .sort_li{
        display: inline-block;
    }
</style>
<link rel="stylesheet" href="${ctxPath}/static/css/jqui/jquery-ui.min.css">
<script src="${ctxPath}/static/js/jquery-ui.min.js"></script>
<script src="${ctxPath}/static/modular/arrival/customer/recharge.js"></script>
<script>

    var serviceActualPay = $("#serviceActualPay").val();
    var payorrefund = document.getElementById('payorrefund').value;   //退款还是结账
    if (payorrefund == '退款') {
        serviceActualPay = serviceActualPay.substring(1);
        document.getElementById('moneyShou').innerText="退款金额："+serviceActualPay+"元";
        document.getElementsByClassName('amountOfBalance2')[0].value = serviceActualPay
    }else if(payorrefund == '结账'){
        document.getElementById('moneyShou').innerText="结账金额："+serviceActualPay+"元";
        document.getElementsByClassName('amountOfBalance2')[0].value = serviceActualPay
    }

    $(".addway").click(function () {
        var way = $(".way").eq(0).clone();

        var money = 0;
        for(var i=0 ; i<$(".amountOfBalance2").length ; i++){
            money += parseFloat($(".amountOfBalance2").eq(i).val())
        }
        var s = parseFloat(serviceActualPay - money);
        way.find('.amountOfBalance2').val(s);
        way.find('.remarks').val("");

        $(this).parent().parent().before(way)
    });
</script>
@}
